import React, { useState } from "react";
import { Button, Typography, Card } from "antd";
import Context from "./components/Context";
import Conunt from "./components/Count";
import ReducerDemo from "./components/reducer/Reducer";
const Index = () => {
  const [count, setCount] = useState(0);
  const { Title } = Typography;
  return (
    <Card>
      <Title level={2}>Antd引入示例</Title>
      <Button type="primary">primary</Button>
      <Button>default</Button>
      <Button type="text">text</Button>
      <Button type="ghost">ghost</Button>
      <Button type="dashed">dashed</Button>
      <Button type="danger">danger</Button>
      <Button type="link">link</Button>
      <Title level={2}>useContext示例</Title>
      <Context.Provider
        value={{
          count,
          setCount: (type) =>
            type === "add" ? setCount(count + 1) : setCount(count - 1),
        }}
      >
        <Conunt />
      </Context.Provider>
      <Title level={2}>useReducer示例</Title>
      <ReducerDemo></ReducerDemo>
    </Card>
  );
};
export default Index;
